﻿<%@ Page Title="" Language="C#" MasterPageFile="~/template.Master" AutoEventWireup="true" CodeBehind="registration.aspx.cs" Inherits="TravelExpertsASP.registration" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    
<!--+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 The registrating/sign-up form can go here...right after the bottom line.
 _____________________________________________________________________________________________________________________-->
  <!-- 
 Author:Jignesh Chaudhari  
 Written: 2013-Jan 20
 Purpose: Implementing server side(using default asp validation control) and client side validation(using java script)
 -->
 
     
 <div id="regForm" runat="server">
 <img src="/images/bora_bora.jpg" alt="pic of Bora Bora" class="imgBanner" />
     <table class="regTable">


         <tr>
             <td class="right">
                 First Name:
             </td>
             <td>
                 <asp:TextBox ID="txtFirstName" runat="server" MaxLength="25"></asp:TextBox>

                 <asp:RequiredFieldValidator ID="rfvFirstNm" runat="server" 
                     ErrorMessage="*First name is required field for registration." BackColor="White" 
                     ControlToValidate="txtFirstName" ForeColor="Red" ValidationGroup="grp1" 
                     Display="Dynamic" ></asp:RequiredFieldValidator>

             </td>
         </tr>
         <tr>
             <td class="right">
                 Last Name:
             </td>
             <td>
                 <asp:TextBox ID="txtLastName" runat="server" MaxLength="25"></asp:TextBox>

                 <asp:RequiredFieldValidator ID="rfvlastNm" runat="server" 
                     ErrorMessage="*Last name is required field for registration." BackColor="White" 
                     ControlToValidate="txtLastName" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>

             </td>
         </tr>
         <tr>
             <td class="right">
                 Address: 
             </td>
             <td>
                 <asp:TextBox ID="txtAddress" runat="server" MaxLength="75"></asp:TextBox>

                 <asp:RequiredFieldValidator ID="rfvAddr" runat="server" 
                     ErrorMessage="*Address is required field for registration." BackColor="White" 
                     ControlToValidate="txtAddress" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>

             </td>
         </tr>
         <tr>
             <td class="right">
                 City: 
             </td>
             <td>
                 <asp:TextBox ID="txtCity" runat="server" MaxLength="50"></asp:TextBox>

                 <asp:RequiredFieldValidator ID="rfvCity" runat="server" 
                     ErrorMessage="*City is required field for registration." BackColor="White" 
                     ControlToValidate="txtCity" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>
             </td>
         </tr>
         <tr>
             <td class="right">
                 Province: 
             </td>
             <td>
                 <asp:TextBox ID="txtProv" runat="server" MaxLength="2"></asp:TextBox>

                 <asp:RequiredFieldValidator ID="rfvProv" runat="server" 
                     ErrorMessage="*Province is required field for registration." BackColor="White" 
                     ControlToValidate="txtProv" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>
             </td>
         </tr>
         <tr>
             <td class="right">
                 Postal <span class="hint"></span>: 
             </td>
             <td>
                 <asp:TextBox ID="txtPostal" runat="server" MaxLength="7"></asp:TextBox>

                 <asp:RequiredFieldValidator ID="rfvPostal" runat="server" 
                     ErrorMessage="*Postal is required field for registration." BackColor="White" 
                     ControlToValidate="txtPostal" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>
             </td>
         </tr>
         <tr>
             <td class="right">
                 Country: 
             </td>
            
             <td>
                 <asp:TextBox ID="txtCountry" text="Canada" runat="server" MaxLength="25"></asp:TextBox>
                 
                 <asp:RequiredFieldValidator ID="rfvCountry" runat="server" 
                     ErrorMessage="*Country is required field for registration." BackColor="White" 
                     ControlToValidate="txtCountry" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>
             </td>
         </tr>
         
         <tr>
             <td class="right">
                 Home Phone <span class="hint"></span>: 
             </td>
             <td>
                 <asp:TextBox ID="txtHomePhone" runat="server" MaxLength="20"></asp:TextBox>

             </td>
         </tr>
         <tr>
             <td class="right">
                 Business Phone <span class="hint"></span>: 
             </td>
             <td>
                 <asp:TextBox ID="txtBusPhone" runat="server" MaxLength="20"></asp:TextBox>
                 
                 <asp:RequiredFieldValidator ID="rfvBusPhone" runat="server" 
                     ErrorMessage="*Business phone no is required field for registration." BackColor="White" 
                     ControlToValidate="txtBusPhone" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>
             </td>
         </tr>
                  <tr>
             <td class="right">
                Agent id:
             </td>
             <td>
                 <asp:TextBox ID="txtAgtId" runat="server" MaxLength="1"></asp:TextBox>
                 
             </td>
         </tr>
         <tr>
             <td class="right">
                 Email: 
             </td>
             <td>
                 <asp:TextBox ID="txtEmail" runat="server" MaxLength="50"></asp:TextBox>
                 
                 <asp:Label ID="lblCheckEmail" runat="server" Enabled="False" 
                     ForeColor="#FF3300"></asp:Label>
                 
                 <asp:RequiredFieldValidator ID="rfvEmail" runat="server" 
                     ErrorMessage="*Email is required field for registration." BackColor="White" 
                     ControlToValidate="txtEmail" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>
             </td>
         </tr>
         <tr>
             <td class="right">
                 Password: 
             </td>
             <td>
                 <asp:TextBox ID="txtPassword" runat="server" TextMode="Password" MaxLength="30"></asp:TextBox>
                 
                 <asp:RequiredFieldValidator ID="rfvPwd" runat="server" 
                     ErrorMessage="*Password is required field for registration." BackColor="White" 
                     ControlToValidate="txtPassword" ForeColor="Red" ValidationGroup="grp1"  Display="Dynamic"></asp:RequiredFieldValidator>
                 <asp:CompareValidator ID="cmpPwdValidate" runat="server" 
                     ControlToCompare="txtPassword" ControlToValidate="txtConfirmPassword" 
                     Display="Dynamic" 
                     ErrorMessage="Password and confirm password field should have same value." 
                     ForeColor="#FF3300" ValidationGroup="grp2"></asp:CompareValidator>
             </td>
         </tr>
         <tr>
             <td class="right">
                 Confirm Password: 
             </td>
             <td>
                 <asp:TextBox ID="txtConfirmPassword" runat="server" TextMode="Password" 
                     MaxLength="30"></asp:TextBox>
                 
                 <asp:RequiredFieldValidator ID="rfvConfiPwd" runat="server" 
                     ErrorMessage="*Confirm password is required field for registration." BackColor="White" 
                     ControlToValidate="txtConfirmPassword" ForeColor="Red" ValidationGroup="grp1" ></asp:RequiredFieldValidator>
             </td>
         </tr>
         <tr>
             <td>
                 <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick=" return validate()" 
                     onclick="btnSubmit_Click" /> 
             </td>
             <td>
                    <asp:Button ID="btnReset" runat="server" Text="Reset"  
                     OnClientClick="clearinputs('text');" /> 
                   
                  
             </td>
         </tr>
     </table>
 </div>

   <!-- 
 Author:Jignesh Chaudhari  
 Written: 2013-Jan 20
 Purpose: Implementing client side validation(using java script)
 -->
<script language="javascript" type="text/javascript">
    function validate() 
    {


        if (document.getElementById("<%=txtFirstName.ClientID %>").value == "") {
            alert("You should enter your First Name.");
            document.getElementById("<%=txtFirstName.ClientID %>").focus();
            return false;
        }

        else if (document.getElementById("<%=txtLastName.ClientID %>").value == "") {
            alert("You should enter your Last Name.");
            document.getElementById("<%=txtLastName.ClientID %>").focus();
            return false;
        }
        else if (document.getElementById("<%=txtAddress.ClientID %>").value == "") {
            alert("You should enter your address.");
            document.getElementById("<%=txtAddress.ClientID %>").focus();
            return false;
        }
        else if (document.getElementById("<%=txtCity.ClientID %>").value == "") {
            alert("You should enter City name.");
            document.getElementById("<%=txtCity.ClientID %>").focus();
            return false;
        }
        else if (document.getElementById("<%=txtProv.ClientID %>").value == "") {
            alert("You should enter province name.");
            document.getElementById("<%=txtProv.ClientID %>").focus();
            return false;
        }
        else if (document.getElementById("<%=txtPostal.ClientID %>").value == "") {
            alert("You should enter postal code.");
            document.getElementById("<%=txtPostal.ClientID %>").focus();
            return false;
        }

        var regEx = /[a-zA-Z][0-9][a-zA-Z](-| |)[0-9][a-zA-Z][0-9]/;
         if (!regEx.test(document.getElementById("<%=txtPostal.ClientID %>").value)) {
          
            alert('Invalid Postal Code');
        }

         if (document.getElementById("<%=txtCountry.ClientID %>").value == "") {
            alert("You should enter Country name.");
            document.getElementById("<%=txtCountry.ClientID %>").focus();
            return false;
        }
         if (document.getElementById("<%=txtBusPhone.ClientID %>").value == "") {
            alert("You should enter your business phone number.");
            document.getElementById("<%=txtBusPhone.ClientID %>").focus();
            return false;
        }
      
         if (document.getElementById("<%=txtEmail.ClientID %>").value == "") {
            alert("You should enter email address.");
            document.getElementById("<%=txtEmail.ClientID %>").focus();
            return false;
        }

        var emailPat = /^(\".*\"|[A-Za-z]\w*)@(\[\d{1,3}(\.\d{1,3}){3}]|[A-Za-z]\w*(\.[A-Za-z]\w*)+)$/;
        var emailid = document.getElementById("<%=txtEmail.ClientID %>").value;
        var matchArray = emailid.match(emailPat);
        if (matchArray == null) {
            alert("Your email address seems incorrect. Please try again.");
            document.getElementById("<%=txtEmail.ClientID %>").focus();
            return false;
        }

         if (document.getElementById("<%=txtPassword.ClientID %>").value == "") {
            alert("You should enter your password.");
            document.getElementById("<%=txtPassword.ClientID %>").focus();
            return false;
        }
         if (document.getElementById("<%=txtConfirmPassword.ClientID %>").value == "") {
            alert("You should enter confirm password.");
            document.getElementById("<%=txtConfirmPassword.ClientID %>").focus();
            return false;
        }

        var phoneNumberPattern = /^\(?(\d{3})\)?[- ]?(\d{3})[- ]?(\d{4})$/; 
        var phoneValue = document.getElementById("<%=txtHomePhone.ClientID %>").value;
        var matchPhoneArray = phoneValue.match(phoneNumberPattern);
         if (matchPhoneArray == null) {
            if (phoneValue == "") {
                //no value is entered.. null value accepted
            }
            else {
                alert("Your phone number is incorrect. Please enter valid phone number.");
                document.getElementById("<%=txtHomePhone.ClientID %>").focus();
                return false;
            }

        }

        var busPhoneValue = document.getElementById("<%=txtBusPhone.ClientID %>").value;
        var matchBusPhoneArray = busPhoneValue.match(phoneNumberPattern);
         if (matchBusPhoneArray == null) {
            alert("Your business phone number is incorrect. Please try again.");
            document.getElementById("<%=txtBusPhone.ClientID %>").focus();
            return false;
        }

        var value = Number(document.getElementById("<%=txtAgtId.ClientID%>").value);
         if (isNaN(value)) {
            // value is not a number
            alert("value is not an integer.Please enter integer value in agent id.");
            document.getElementById("<%=txtAgtId.ClientID %>").focus();
            return false;
        }
        


        return true;
    }

    function clearinputs(sType) 
    {
        
        a = document.getElementsByTagName("input");

        for (i = 0; i < a.length; i++) 
        {

            if (a[i].type == sType) 
            {
                
                a[i].value = "";
                
            }
            
        }

        document.getElementById("<%=txtPassword.ClientID%>").value = "";
        document.getElementById("<%=txtConfirmPassword.ClientID %>").value = "";
       
        return false;   
    }
    
</script>


</asp:Content>
